<!DOCTYPE html>
<html lang="zh">

	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<meta http-equiv="X-UA-Compatible" content="ie=edge" />
		<title>{{title}}</title>
	</head>
	<style type="text/css">
		.log_reg_box {
			max-width: 400px;
			min-width: 400px;
			margin: 100px auto;
		}
		
		.display_none {
			display: none;
		}
	</style>

	<body style="height: 10000px;">
		{{include "./header2.html"}}

		<div class="log_reg_box">
			<div id="errDiv" errCode="{{code}}" class=" display_none alert alert-danger alert-dismissable">
				<span id="errMsg">邮箱已被使用</span>
			</div>
			<ul class="nav nav-tabs">
				<li role="presentation" name="login" class="nav_item active">
					<a href="#">登陆</a>
				</li>
				<li role="presentation" name="register" class="nav_item">
					<a href="#">注册</a>
				</li>
			</ul>
			<br />
			<div class="log_form">
				<form action="/login" method="post">
					<input type="email" name="email" id="log_email" value="" placeholder="请输入电子邮箱地址" class="form-control" />
					<br />
					<input type="password" name="password" id="log_password" value="" placeholder="密码 6-16位,区分大小写,不能用空格" class="form-control" />
					<br />
					<input type="submit" id="submit_login" class="btn btn-lg btn-info btn-block" onclick="return false" value="登陆" />

				</form>
			</div>
			<div class="reg_form display_none">
				<form action="/register" method="post">
					<input type="email" name="email" id="reg_email" placeholder="请输入电子邮箱地址" class="form-control" />
					<br />
					<input type="password" name="password" id="reg_password" placeholder="密码 6-16位,区分大小写,不能用空格" class="form-control" />
					<br />
					<input type="text" name="name" id="reg_name" placeholder="昵称2-18位，中英文，数字以及下划线" class="form-control" />
					<br />
					<input type="submit" id="submit_register" class="btn btn-lg btn-info btn-block" onclick="return false" value="注册" />

				</form>
			</div>
		</div>

	</body>

</html>
<script type="text/javascript">
	$(".nav_item").on("click", function() {
		$(".nav_item").removeClass("active")
		$(this).addClass("active")
		var name = $(this).attr("name")
		if(name == "login") {
			$(".log_form").removeClass("display_none")
			$(".reg_form").addClass("display_none")
		} else if(name == "register") {
			$(".log_form").addClass("display_none")
			$(".reg_form").removeClass("display_none")
		}

	})


$("#submit_register").on("click",function(){
	console.log("点击注册")
	checkRegister()
  	
})

$("#submit_login").on("click",function(){
	console.log("点击注册")
	checkLogin()
  	
})


function checkLogin(){
	var email = $("#log_email").val()
	var password = $("#log_password").val()
	var email_reg =  /^\w+((.\w+)|(-\w+))@[A-Za-z0-9]+((.|-)[A-Za-z0-9]+).[A-Za-z0-9]+$/;
	var pwd_reg = /^(\w){6,16}$/
	var data = ({email:email,password:password})
	if(email_reg.test(email)){
		if(pwd_reg.test(password)){
			reg_log_post("/login",data,function(arg){
				//showErrDiv(arg.info)
				location.href = "/"
			})
		}else{
			//密码格式不对
			showErrDiv("密码格式不对")
		}
	}else{
		//邮箱格式不对
		showErrDiv("邮箱格式不对")
	}
}

//定义一个登陆注册共用的ajax同步请求
function reg_log_post(urlpath,datas,callback){
	$.ajax({
    url: urlpath,
    type: "POST",
    data: datas,
     async: false,//这里表示同步
     dataType: 'json',
     cache: false,
     success: function (args){
     	callback(args)
     }//请求成功返回后执行的动作

  });
}

	function showErrDiv(info){
		$("#errDiv").removeClass("display_none")
		$("#errMsg").text(info)
	}
	
	function checkRegister(){
		var email = $("#reg_email").val()
		var password = $("#reg_password").val()
		var name = $("#reg_name").val()
		var email_reg =  /^\w+((.\w+)|(-\w+))@[A-Za-z0-9]+((.|-)[A-Za-z0-9]+).[A-Za-z0-9]+$/;
		var pwd_reg = /^(\w){6,16}$/
		var name_reg =  /^[\w\u4e00-\u9fa5]{2,18}$/
		if(email_reg.test(email)){
			if(pwd_reg.test(password)){
				if(name_reg.test(name)){
					$("#errDiv").addClass("display_none")
					var data = {email:email,password:password,name:name}
					reg_log_post("/register",data,function(arg){
						console.log(arg)
						showErrDiv(arg.info)
					})
				}else{
					//昵称格式不对
					showErrDiv("昵称格式不正确！")
				}
			}else{
				//密码格式不对
				showErrDiv("密码格式不正确！")
			}
		}else{
			//邮箱格式不对
			showErrDiv("邮箱格式不正确！")
		}
		
	}


	function check() {
		var errCode = $("#errDiv").attr("errCode")
		if(errCode != "") {
			if(errCode == 111) {
				$("#errDiv").removeClass("display_none")
				$("#errMsg").text("邮箱已被使用")
			} else if(errCode == 112){
				
			}
		} else {

		}
	}
</script>